<template>
	<div>
		<div class="flex justify_content_between align_items_center  content-wrapper p_lr_20 m_b_20">
			<div>
				<h2>产品管线</h2>
			</div>
			<div>
				<Language></Language>
			</div>
		</div>

		<div  class="content-wrapper p_20">
			<div class="back">
				<div class="d1 flex align_items_center" style="top:78px;left:280px" @click="edit('pli_0')">
					<img :src="imgURL + tableData.pli_0.value.img_url" alt="" width="100%">
				</div>
				<div class="d1 flex align_items_center" style="top:302px;left:623px" @click="edit('pli_1')">
					<img :src="imgURL + tableData.pli_1.value.img_url" alt="" width="100%">
				</div>
				<div class="d1 flex align_items_center" style="top:76px;left:960px" @click="edit('pli_2')">
					<img :src="imgURL + tableData.pli_2.value.img_url" alt="" width="100%">
				</div>
				
				<div class="d2" style="top:694px;left:378px"  @click="editContent('pli_3')">
					{{tableData.pli_3.value.content}}
				</div>
			</div>
				<div class="up_div m_t_10 flex align_items_center p_20" >
					<span class="m_r_20">完整管线文件:</span>
					<!-- <el-button @click="editFile('pli_4')">上传</el-button> -->
					
					<!-- <el-form-item label="完整管线内容" > -->
						<el-upload class="avatar-uploader" ref="img" :action="BaseURL + 'Development/uploadImg'" :file-list="fileList" :show-file-list="true" :headers="{token:'15738257957'}" :name="upImg.name" :on-success="handleAvatarSuccess">
							<el-button size="small" type="primary">点击上传</el-button>
						</el-upload>
					<!-- </el-form-item> -->
				</div>
				<Edit ref="Edit"></Edit>
		
		<!-- 编辑内容 -->
		<el-dialog :visible.sync="isShow1" title="编辑" :close-on-click-modal="false" @close="closeDialog">
			<!-- <el-divider></el-divider> -->
			<el-form label-width="80px">
				
				
				<el-form-item label="内容" >
					<el-input v-model="form.content" class="w_400" type="textarea" :rows="6"></el-input>
				</el-form-item>
				
				
			</el-form>
			<span slot="footer" class="dialog-footer">
				<el-button @click="closeDialog">取 消</el-button>
				<el-button type="primary" @click="submit">确 定</el-button>
			</span>
		</el-dialog>
		
		
		
		</div>
	</div>
</template>
<script type="text/javascript">
	import methods from './method'
	import Edit from './edit/edit'

	export default {
		data() {
			return {
				tableData: [], //列表数据
				
				// c:'',
				key1:'',//key
				isShow1:false,//标题内容编辑
				isShow2:false,
				form:{//form
					content:''
				},
				fileList:[],
				upImg:{
					label: '完整管线文件',
					imageUrl: '',
					name: 'file',
					width: '1241',
					height: '400',
					file: ''
				},
				
			}
		},
		methods: methods,
		components:{
			Edit
		},
		mounted() {
			this.getTableData()
		}
	}
</script>

<style scoped>
	.back {
		height: 1000px;
		width:1500px;
		background: url(../../../assets/imgs/pipeline.jpg) no-repeat;
		background-size: contain;
		position: relative;
	}
	.back div {
		position: absolute;
		/* color:#fff; */
		padding: 10px;
		box-sizing: border-box;
		/* border: 1px solid #F00; */
	}
	
	.back .d1 {
		width: 198px;
		height: 227px;
	}
	
	.back .d2 {
		width: 975px;
		height: 253px;
	}
	
	.back .up_div {
		width: 198px;
		height: 227px;
	}
</style>